<template>
  <div>
    <div class="button">
      <el-button @click="addSection">添加节</el-button>
    </div>
    <div class="sectionList">
       <el-table
        :data="sectionList"
        border
        style="width: 100%">
        <el-table-column
          label="序号"
          width="325"
          type="index">
        </el-table-column>
        <el-table-column
          prop="title"
          label="节名称"
          width="400">
        </el-table-column>
        <el-table-column
        prop="orderby"
          label="权重"
          width="400">  
        </el-table-column>
        <el-table-column
          label="操作"
          width="100">
          <template slot-scope="scope">
            <el-button type="text" size="small">编辑</el-button>
            <el-button @click="deleteSection(scope.row.id)" type="text" size="small" >删除</el-button>
          </template>
        </el-table-column>
  </el-table>
    </div>
  </div>
</template>

<script>
import request from "../utils/request"
export default {
    data() {
        return {
          sectionList:[]
        }
    },
    methods:{
        handleClose(done) {
        this.$confirm('确认关闭？')
          .then(() => {
            done();
            this.isEdit = false
          })
          .catch(() => {});
      },
      handleClick(row) {
        console.log(row);
      },
      addSection(){
        this.$router.push(`/createsection?chapter_id=${this.chapter_id}`)
      },
      getSection(){
        request.get(`section?chapter_id=${this.chapter_id}`).then(res=>{
           if(res.data.code === 20000){
             this.sectionList = res.data.data
            }else{
              this.$message.error("获取列表失败，请重试")
            }
  
        })
      },
      deleteSection(id){
        this.$confirm('确认删除？')
          .then(() => {
            request.delete(`section/${id}`).then((res) => {
                if (res.data.code === 20000) {
                  this.$message.info("删除成功")
                 this.getSection()
                }
            });
          })
          .catch(() => {
            this.$message.info("取消删除")
          });
      }
    },

    computed:{
      chapter_id(){
        return this.$route.query.chapter_id
      }
    },
    mounted() {
      this.getSection()
    },
}
</script>

<style lang="less" scoped>
    
</style>